<!DOCTYPE html>
<html lang="en"  xmlns:th="http://www.thymeleaf.org">

  <head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>培盛 - Happy Birthday</title>

    <!-- Bootstrap core CSS -->
    <link th:href="@{user/birthday/vendor/bootstrap/css/bootstrap.min.css}" rel="stylesheet">

    <!-- Custom fonts for this template -->
    <link href="https://fonts.googleapis.com/css?family=Saira+Extra+Condensed:100,200,300,400,500,600,700,800,900" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i" rel="stylesheet">
    <link th:href="@{user/birthday/vendor/font-awesome/css/font-awesome.min.css}" rel="stylesheet">
    <link th:href="@{user/birthday/vendor/devicons/css/devicons.min.css}" rel="stylesheet">
    <link th:href="@{user/birthday/vendor/simple-line-icons/css/simple-line-icons.css}" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link th:href="@{user/birthday/css/resume.min.css}" rel="stylesheet">
  </head>
  <body id="page-top" th:style="'background:url(' + @{/user/birthday/img/background.png} + ');'">
    <nav class="navbar navbar-expand-lg navbar-dark bg-primary fixed-top" id="sideNav"  style="background:#3399FF;">
      <a class="navbar-brand js-scroll-trigger" href="#page-top">
        <span class="d-block d-lg-none">Start Bootstrap</span>
        <span class="d-none d-lg-block">
          <img class="img-fluid img-profile rounded-circle mx-auto mb-2" th:src="@{user/birthday/img/图片0.png}" alt="">
        </span>
      </a>
      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
      <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="navbar-nav">
          <li class="nav-item">
            <a class="nav-link js-scroll-trigger" href="#about">阅读须知</a>
          </li>
          <li class="nav-item">
            <a class="nav-link js-scroll-trigger" href="#experience">时</a>
          </li>
          <li class="nav-item">
            <a class="nav-link js-scroll-trigger" href="#education">培</a>
          </li>
          <li class="nav-item">
            <a class="nav-link js-scroll-trigger" href="#skills">盛</a>
          </li>
          <li class="nav-item">
            <a class="nav-link js-scroll-trigger" href="#interests">生日快乐</a>
          </li>
          <li class="nav-item">
            <a class="nav-link js-scroll-trigger" href="#awards">参演人员</a>
          </li>
        </ul>
      </div>
    </nav>

    <div class="container-fluid p-0">
      <section class="resume-section p-3 p-lg-5 d-flex d-column" id="about">
        <div class="my-auto">
          <h1 class="mb-0" style="color:#ff66CC">Happy
            <span class="text-primary">Birthday!</span>
          </h1>
          <div class="subheading mb-5" style="color:white;">这是你所有父亲给你的爱
            <a href="mailto:name@email.com">生日快乐！</a><button onclick="disappear();">若影响观看点击更换背景</button>
          </div>
          <p class="mb-5" style="color:white;">该网站的所有素材均由赵婷女士提供，太有心了，快表示吧。这个页面里包含了寝室所有人对你的关心与爱，生日快乐培盛~！<br>而且你看鼠标点击的特效，可都是我为你专门准备的哈哈哈哈</p>
          <ul class="list-inline list-social-icons mb-0">
            <!--<li class="list-inline-item">-->
              <!--<a href="#">-->
                <!--<span class="fa-stack fa-lg">-->
                  <!--<i class="fa fa-circle fa-stack-2x"></i>-->
                  <!--<i class="fa fa-facebook fa-stack-1x fa-inverse"></i>-->
                <!--</span>-->
              <!--</a>-->
            <!--</li>-->
            <!--<li class="list-inline-item">-->
              <!--<a href="#">-->
                <!--<span class="fa-stack fa-lg">-->
                  <!--<i class="fa fa-circle fa-stack-2x"></i>-->
                  <!--<i class="fa fa-twitter fa-stack-1x fa-inverse"></i>-->
                <!--</span>-->
              <!--</a>-->
            <!--</li>-->
            <!--<li class="list-inline-item">-->
              <!--<a href="#">-->
                <!--<span class="fa-stack fa-lg">-->
                  <!--<i class="fa fa-circle fa-stack-2x"></i>-->
                  <!--<i class="fa fa-linkedin fa-stack-1x fa-inverse"></i>-->
                <!--</span>-->
              <!--</a>-->
            <!--</li>-->
            <!--<li class="list-inline-item">-->
              <!--<a href="#">-->
                <!--<span class="fa-stack fa-lg">-->
                  <!--<i class="fa fa-circle fa-stack-2x"></i>-->
                  <!--<i class="fa fa-github fa-stack-1x fa-inverse"></i>-->
                <!--</span>-->
              <!--</a>-->
            <!--</li>-->
          </ul>
        </div>
      </section>
      <div class="tlinks">Collect from <a href="https://www.soulblack.top/" >blog</a></div>

      <section class="resume-section p-3 p-lg-5 d-flex flex-column" id="experience"style="color:white;">
        <div class="my-auto">
          <h2 class="mb-5" style="color:white;">时时盏里生红浪。</h2>

          <div class="resume-item d-flex flex-column flex-md-row mb-5">
            <div class="resume-content mr-auto">
              <h3 class="mb-0" style="color:white;">渔家傲 花底忽闻敲两桨</h3>
              <div class="subheading mb-3" style="color:white;">宋 欧阳修</div>
              <p><b>&nbsp;&nbsp;&nbsp;&nbsp;花底忽闻敲两桨。逡巡女伴来寻访。酒盏旋将荷叶当。莲舟荡。<span style="color:#ff6666">时时盏里生红浪。</span>
花气酒香清厮酿。花腮酒面红相向。醉倚绿阴眠一饷。惊起望。船头阁在沙滩上。</b><br><br>
&nbsp;&nbsp;&nbsp;&nbsp;意思是摘下荷花当酒杯，采莲船在荷花池中荡漾。粉红色的荷花映酒中，杯里时时翻红浪。清新的荷香、醇美的酒味，搅在一起；粉红的荷花、粉红的脸蛋，同映酒缸。绿色的荷叶丛中，醉了正好躺一躺。一觉醒来抬头望，船头搁浅在沙滩上。</p>
			  <p>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff66CC">这首诗是希望你的每一天都能安逸的在“荷花池”醉了躺，醒了闻着荷香，酒香，潇洒快活。刚好你的生日也是6月，所以就很应景。</span></p>
            </div>
			<img style="width:50%; height:50%;" th:src="@{user/birthday/img/图片1.png}">

          </div>
        </div>

      </section>

      <section class="resume-section p-3 p-lg-5 d-flex flex-column" id="education" style="color:white;">
        <div class="my-auto">
          <h2 class="mb-5" style="color:white;">培火螭炉起宝熏。</h2>

          <div class="resume-item d-flex flex-column flex-md-row mb-5">
            <div class="resume-content mr-auto">
              <h3 class="mb-0" style="color:white;">龟堂晨起</h3>
              <div class="subheading mb-3" style="color:white;">宋 陆游</div>
              <p><b><span style="color:#ff6666">培火螭炉起宝熏，</span>滴泉鏊矸聚玄云。<br>
				屏围燕几成山字，簟展凉轩作水纹。<br>
				绝口不谈浮世事，洗心聊策退居勋。<br>
				耄年犹健非无自，一卷丹经受郑君。</b></p>
			  <p>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff66CC">这个是希望你能够努力生活，居安思危。因为这首诗没有翻译我也读不懂，然后瞎说就完事了。反正就是要好好学习，天天向上。</span></p>
            </div>
			<img style="width:50%; height:50%;" th:src="@{user/birthday/img/图片2.png}">

          </div>
        </div>
      </section>

      <section class="resume-section p-3 p-lg-5 d-flex flex-column" id="skills" style="color:white;">
        <div class="my-auto">
          <h2 class="mb-5" style="color:white;">盛世欢娱情好尚。</h2>

          <div class="resume-item d-flex flex-column flex-md-row mb-5">
            <div class="resume-content mr-auto">
              <h3 class="mb-0" style="color:white;">缘识</h3>
              <div class="subheading mb-3" style="color:white;">宋太宗</div>
              <p><b>承平此事比应难，<span style="color:#ff6666">盛世欢娱情好尚。</span><br>
				添兴况，堪可爱，香尘坠里无妨碍。<br></b><br>
				&nbsp;&nbsp;&nbsp;&nbsp;大概意思就是宋太宗自夸然后说朕的盛世让人愉悦逍遥实在是了不得啊。</p>
			  <p>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff66CC">取这句的意思就是希望你有宋太宗的胸怀然后对着自己的未来说“盛世欢娱情好尚。”</span></p>
            </div>
			<img style="width:50%;" th:src="@{user/birthday/img/图片3.png}">

          </div>
        </div>
      </section>

      <section class="resume-section p-3 p-lg-5 d-flex flex-column" id="interests">
        <div class="my-auto">
          <h2 class="mb-5" style="color:#ff66CC">请欣赏你的生贺视频</h2>
		  
		</div>
		<div class="col-xs-12" >
			<div class="col-xs-6" style="margin:0 auto; float:left;">
			<h1 style="color:#ff6666;">20周岁----------</h1><br>
			<video th:src="@{user/birthday/video/2018.mp4}" controls="controls" type="video/mp4" style="width:500px;height:330px;align:center;"></video>
			</div>
			<div class="col-xs-6" style="margin:0 auto; float:right;">
			<h1 style="color:#ff6666;">------------>21周岁</h1><br>
			<video th:src="@{user/birthday/video/SPS.mp4}" controls="controls" type="video/mp4" style="width:500px;height:50%;align:center;"></video>
			</div>
		</div>
		<div class="my-auto">
		  
          <p>开发者的话：赵婷做的两段视频，当这两段视频交给我的时候我真的是有被感动到，我觉得一个人再用心不过如此，真的很棒了，正如李阳在视频里说的那样，是不是要表示一下，哈哈哈哈哈。<br>另外如果你是chrome浏览器，请打开F12，点击console，领取开发者给你的专属彩蛋一个。</p>
          
        </div>
		
      </section>

      <section class="resume-section p-3 p-lg-5 d-flex flex-column" id="awards" style="color:white;">
        <div class="my-auto">
          <h2 class="mb-5" style="color:white;">参演 &amp; 人员</h2>
          <ul class="fa-ul mb-0">
            <li>
              <i class="fa-li fa fa-trophy text-warning"></i>
              主创/素材/视频制作/策划：赵婷女士</li>
            <li>
              <i class="fa-li fa fa-trophy text-warning"></i>
              参演<sup>st</sup>
              &nbsp;要喝慢酒-吴建成</li>
            <li>
              <i class="fa-li fa fa-trophy text-warning"></i>
              参演<sup>st</sup>
              &nbsp;生物老师-曾仕麒</li>
            <li>
              <i class="fa-li fa fa-trophy text-warning"></i>
              参演<sup>st</sup>
              &nbsp;标准川普-李&nbsp;&nbsp;&nbsp;&nbsp;阳</li>
            <li>
            <li>
              <i class="fa-li fa fa-trophy text-warning"></i>
              参演<sup>st</sup>
              &nbsp;数学无敌-唐颖颖</li>
            <li>
              <i class="fa-li fa fa-trophy text-warning"></i>
              参演<sup>st</sup>
              &nbsp;全寝纯洁-廉雪峰</li>
            <li>
            <li>
              <i class="fa-li fa fa-trophy text-warning"></i>
              参演<sup>st</sup>
              &nbsp;七父之子-安必义</li>
            <li>
            <li>
              <i class="fa-li fa fa-trophy text-warning"></i>
              参演<sup>st</sup>
              &nbsp;头发增高-吴轩光</li>
            <li>
              <i class="fa-li fa fa-trophy text-warning"></i>
              参演<sup>st</sup>
              &nbsp;徐财鑫</li>
            <li>
              <i class="fa-li fa fa-trophy text-warning"></i>
              参演<sup>st</sup>
              &nbsp;吴振国</li>
          </ul>
        </div>
      </section>

    </div>

    <!-- Bootstrap core JavaScript -->
    <script th:src="@{user/birthday/vendor/jquery/jquery.min.js}"></script>
    <script th:src="@{user/birthday/vendor/bootstrap/js/bootstrap.bundle.min.js}"></script>

    <!-- Plugin JavaScript -->
    <script th:src="@{user/birthday/vendor/jquery-easing/jquery.easing.min.js}"></script>
	<script th:src="@{user/birthday/js/index.js}"></script>

    <!-- Custom scripts for this template -->
    <script th:src="@{user/birthday/js/resume.min.js}"></script>
	<script>
	$(function(){
        console.log("    首先祝培盛生日快乐了，我也不清楚这是不是我们最后一次在一起陪你度过这个生日，但有机会能给你留下一点什么我觉得我很荣幸。当赵婷找到我说打算做一个网站的时候，" +
		"我也是毫不犹豫的答应下来，即使我当时说实话真的有很多很多的事情要去做，去忙碌。最后做出的这个作品也并不是让我十分满意，但确实投入了我的心血，可能直男审美做出的网页就是这么可怕了吧，哈哈哈哈");
		console.log("    我其实也真的很感谢这个机会，我的心境在很长一段时间都有一些问题，忘记自己学编程的初衷，我当时是只是希望自己能做一些有意思的事情，而不是偏要分个高低上下，" + 
		"还记得刚学会c的我就立马去尝试完成一个贪吃蛇，后来录了一个贪吃蛇的小视频也是最让我开心的事情。我是第一次为了一个人做网站，也正是由于这次机会我才能正视自己的内心，我并不是为了让自己多么优秀多么厉害，" +
		"只是想用编程来创造一些有意思的东西，来留下纪念，来让我，和我身边的人开心。这个网站的建成，虽然很简单，但确实是我大学到现在以来，做的最有成就感的一件事情，很开心，你和赵婷给了我这个机会，也让我能给你留下点宝贵的记忆。");
		console.log("    最后来说说我们，上大学来最大的收获就是这八个人，我们从一开始来自五湖四海，不夸张的说我上大学之后身边可能只有你们，而在我遭受很多非议的时候也是你们始终支持着我。而在室友当中培盛你的位置又尤为突出，"+
		"我觉得颖颖说的很对[如果你还没看视频那我不小心给你剧透了 哈哈哈]，我觉得你的心性是我们当中最成熟的一个，在很多时候是照顾我们的存在，我也总是会跟其他不了解你的人说，我说培盛是我认识的所有人中最让人觉得舒服的人，"+
		"这并不是说我们寝室之间的情谊有高有低，而是说每个人都有各自的特点，而在处世这方面，我觉得培盛你无疑是我们当中最优秀也是最出色的人，当然这也仅仅代表我的看法。你们每个人都有我羡慕的点，都有我想学习的地方，但你身上的优点"+
		"让我觉得即使从小锻炼我也无法变成像你那样的人。我会担心自己的未来，会想我们寝室其他人的未来，但我从来没有担心过你的未来。你到任何地方，到任何位置，我都觉得你可以很快适应，并赢得大家的真心与喜爱。在某方面来说，你是"+
		"我认为我们寝室中最出色的人，我真的很开心，能从大一开始就和你，和你们分到了一个寝室，虽然大家都说仕麒是最小的，有很多童真，但我知道，这个群体中受到最多照顾的人，其实是我。");
		console.log("    上大学为止我只见过你生气一次，大一的时候我和你吵过架，但那个时候我其实总觉得你是在让着我，你没有表达什么只是在接受我说的一些乱七八糟的话，但反正我不后悔，那个北三B上七楼的楼梯口，也是我人生中的宝贵记忆，"+
		"现在我也记不清我们两个都谈了些什么了，就是单纯的知道这个兄弟我交下了，于是安稳的回去睡了个觉哈哈哈。再其次就是和安狗的那我看到的唯一一次生气，当时我是在拉架，现在想想我觉得没必要，我没见过一个人在生气的时候还能保持冷静，"+
		"我真的觉得那时候的自己是多余的，但表面工作还是要有的 哈哈哈");
		console.log("    感觉说的很乱又很多，后台编辑的页面我也不好看自己之前到底说了些什么，就结个尾吧，我替你感到开心这个大学有很多关心你的人，有很多真心实意的朋友在你的身边，这也都是你应得的。我甚至是觉得能和你交朋友是"+
		"别人的福气，我想你知道这对于我来说真的是给一个人最高的评价了。希望你这个生日能过的开心，希望你的以后一切顺利，即使毕业之后，工作城市不在一起的话，你也要明白，自己是有人时时惦念着的，也很感谢赵婷给了我这个机会让我说了很多真心话了"+
		"最后最后的话无论何时何地，我们随时都在。");
		console.log("    生日快乐！一切顺利！");
	})
	var flag = 1;
	function disappear(){
	
		if(flag == 1){
			$("#page-top").css("background","#000000");
			flag = 0;
		}else{
			$("#page-top").css("background","url(/user/birthday/img/background.png");
			flag = 1;
		}
		
	}
	</script>

  </body>

</html>
